import {PropsWithChildren} from "react";
import LgButton, {LgButtonProps} from "../../button";
import {StandardFooter} from "../standardFooter";
import {createNewClass} from "../utils";
import classNames from "classnames";
import { View } from "@tarojs/components";
import "./index.scss"

export type DoubleButtonFooterProps = PropsWithChildren<{
  className?: string
  leftButton: LgButtonProps & {buttonText: string}
  rightButton: LgButtonProps & {buttonText: string}
}>

const newClass = createNewClass("lg-double-button-footer-")

export const DoubleButtonFooter = (props: DoubleButtonFooterProps) => {
  return(
    <StandardFooter className={classNames(newClass("root"), props.className)}>
      <View className={newClass("container")}>
        <LgButton {...props.leftButton} className={newClass("left-button")}>
          {
            props.leftButton.buttonText
          }
        </LgButton>
        <LgButton {...props.rightButton} className={newClass("right-button")}>
          {
            props.rightButton.buttonText
          }
        </LgButton>
      </View>
    </StandardFooter>
  )
}
